<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="layui/css/layui.css" media="all">
<script type="text/javascript" src="layui/layui.js"></script>
</head>
<body>

	<!-- 添加(修改)页面,默认隐藏 -->
	<form id="m_form" class="layui-form" lay-filter="m_form" action=""
		style="display: none" onsubmit="return false">

		<div class="layui-form-item" style="display: none">
			<label class="layui-form-label">编号:</label>
			<div class="layui-input-block">
				<input type="text" name="id" placeholder="请输入" autocomplete="off"
					class="layui-input">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">名称:</label>
			<div class="layui-input-block">
				<input type="text" name="name" lay-verify=”required”
					placeholder="请输入" autocomplete="off" class="layui-input">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">父ID:</label>
			<div class="layui-input-block">
				<input type="text" id="parentid" name="parentid"
					lay-verify="required" placeholder="请输入" autocomplete="off"
					readonly="true" class="layui-input">
			</div>
		</div>
		<!-- <div class="layui-form-item">
				<label class="layui-form-label">父ID</label>
				<div class="layui-input-inline">
					<select class="clazz" lay-filter="parentid" id="parentid" name="parentid">
						<option value="">请选择~</option>
					</select>
				</div>
			</div> -->


		<div class="layui-form-item">
			<label class="layui-form-label">路径:</label>
			<div class="layui-input-block">
				<input type="text" name="path" lay-verify="required|phone"
					placeholder="请输入" autocomplete="off" class="layui-input">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">权重:</label>
			<div class="layui-input-block">
				<input type="text" name="weight" lay-verify="required|email"
					placeholder="请输入" autocomplete="off" class="layui-input">
			</div>
		</div>


	</form>
	<div class="layui-layout layui-layout-admin">
		<div class="layui-body" style="margin: 1%">

			<div id="test13" class="demo-tree-more"></div>
		</div>

		<script th:src="@{/js/myTree.js}"></script>
	</div>
	<div style="display: none">
		<input type="text" id="result" name="result" autocomplete="off"
			class="layui-input">
	</div>
	<script>
layui.use(['table','layer','form','tree','laydate'], function(){
  var table = layui.table;
  var layer = layui.layer;
  var form = layui.form;
  var laydate = layui.laydate;
  var $ = layui.$;
  var tree = layui.tree;
  
      //动态渲染下拉框
  $.post("getfuname",{},function(res){
  console.log(res);
  for (var i = 0; i < res.length; i++) {
	$(".clazz").append(`<option value="${res[i].id}">${res[i].name}</option>`);	
		}
   form.render('select'); //刷新select选择框渲染
  },"json");  
  
$(function() {
	getData();
})
function getData(){ 
 var Names =document.getElementById("result").innerHTML = localStorage.roleNames;
    $.ajax({
        type: "get",
       data: {id:"0",name:Names},
        url: "findCategoryJson",
        success: function (data) {
            layui.use(['tree', 'util'], function() {
                var tree = layui.tree
                    , layer = layui.layer
                    , util = layui.util
                //无连接线风格
                tree.render({
                    elem: '#test13'
                 	,id:'Tree'
                    ,data: data
                     ,edit: ['add', 'update', 'del'] //操作节点的图标
                     ,showLine: true  //是否开启连接线 	
                       
                      ,operate: function(obj){
					    var type = obj.type; //得到操作类型：add、edit、del
					    var data = obj.data; //得到当前节点的数据
					    var elem = obj.elem; //得到当前节点元素
					    
					    //Ajax 操作
					    var id = data.id; //得到节点索引
					    if(type === 'add'){ //增加节点
					    $("#m_form")[0].reset();; //清空form表单
					     $("#parentid").val(data.parentid);
				layer.open({
					  	type:1,
					  	content:$("#m_form"),
					  	title:'添加学生信息', 	
					  	area:['800px','600px'],
					  	btn: ['确认添加', '取消'],
					  	yes: function(index, layero){
					       $.post("addmodule", $("#m_form").serialize(),
							function(res) {		
								if (res.code == "0") {
								layer.msg(res.msg);
								layer.closeAll();
									
								}else{
									layer.msg(res.msg);
									
								}
								getData();
					}, "json");
					    }
					  	});
					  	console.log(data);
					      
					    } else if(type === 'update'){
					    $("#m_form")[0].reset();; //清空form表单
					     form.val('m_form',data);//数据回显
					     layer.open({
							type:1,
							content:$("#m_form"),
							title:'修改信息',
							area:['800px','600px'],
							btn: ['确认修改', '取消'],
							yes: function(index, layero){
								$.post("updatemodule",$("#m_form").serialize(),
									function(res){
										if(res.code=='0'){							
											layer.closeAll();
											table.reload("Tables");
											layer.msg(res.msg);
										}else{
											layer.msg(res.msg);
										}
										getData();
									},'json');
				  			}
						});
					     
					     
					     
					     
					    } else if(type === 'del'){ //删除节点
					      	layer.confirm('是否删除?', function(index){
								$.post("daleteMod",{
								id:data.id,
								pid:data.pid,
								title:data.title
								},function(res){
								if(res.code=='0'){
								layer.msg(res.msg);
								getData();
								}else{
									layer.msg(res.msg);
								}
								
								},"json")
  
						  layer.close(index);
						});       
					    };
					  }
                });
            }) 
        }, 
    });
}

});
</script>
</body>
</html>